<template>
    <el-dialog v-model="props.visible" title="添加时间段" @close="flaspiopo">
        <el-form :model="form" :label-width="formLabelWidth">
            <el-form-item label="秒杀时间段名称">
                <el-input v-model="form.name" autocomplete="off" />
            </el-form-item>
        </el-form>

        <el-form :model="form" :label-width="formLabelWidth">
            <el-form-item label="每日开始时间">
                <el-time-picker v-model="value1" placeholder="Arbitrary time" />
            </el-form-item>
        </el-form>

        <el-form :model="form" :label-width="formLabelWidth">
            <el-form-item label="每日结束时间">
                <el-time-picker v-model="value1" placeholder="Arbitrary time" />
            </el-form-item>
        </el-form>
        <el-form :model="form" :label-width="formLabelWidth">
            <el-form-item label="是否启用">
                <el-radio-group v-model="radio2" class="ml-4">
                    <el-radio label="1">启用</el-radio>
                    <el-radio label="2">不启用</el-radio>
                </el-radio-group>
            </el-form-item>
        </el-form>


        <!-- 二次确认弹窗 -->
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="visible = false">取消</el-button>
                <el-button type="primary" @click="visible = false">
                    确定
                </el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script lang="ts" setup>
import { reactive, ref, toRefs } from "vue";


const radio2 = ref('1')

const props = defineProps({
    visible: {
        type: Boolean,
    }
})

const emit = defineEmits(['offf'])
const flaspiopo = () => {
    emit("offf")
}
const value1 = ref("")


const state = reactive({

    form: {
        name: "",
        formLabelWidth: "140px"
    }
});

const { form ,formLabelWidth} = toRefs(state);


</script>